#detail{
    width: 80%;
    margin: 0 auto;
    &>.detail-top{
        width: 100%;
        
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;

        &>.box3-top-z1{
            font-size: 3vw;
            font-family: light;
        }
        &>.box3-top-z2{
            font-size: 1.3vw;
            font-weight: bold;
        }
        &>.box3-top-z3{
            margin-top: .5vw;
            font-size: 1vw;
            color: #979797;
        }

    }
    &>.detail-middle{
        width: 100%;
        margin-top: 3vw;
        height: 18vw;
        position: relative;
        &>img{
            width: 28vw;
            height: 14vw;
            position: absolute;
            left: 0;
            top: 2vw;
        }
        &>.middle-right{
            width: 56vw;
            height: 18vw;
            background-color: #f5f5f5;
            position: absolute;
            right: 0;
            &>.detail-z1{
                font-size: 1.5vw;
                font-weight: bold;
                position: absolute;
                left: 8vw;
                top: 4vw;
            }
            &>.detail-z2{
                font-size: 1vw;
                width: 35vw;
                position: absolute;
                left: 8vw;
                top: 7vw;
                text-indent: 2vw;
                font-family: OSLingt;
            }
            &>.detail-z3{
                font-size: 2.3vw;
                font-weight: bold;
                position: absolute;
                right: 1vw;
                top: 2vw;
            }
            &>.detail-z4{
                font-size: 1.5vw;
                position: absolute;
                right: 1.2vw;
                top: 5vw;
                font-family: OSLingt;
            }
        }
    }
    &>.detail-bottom{
        width: 100%;
        margin-top: 4vw;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        &>.detail-item{
            display: flex;
            margin-bottom: 2vw;
            &>.item-a1{
                display: flex;
                flex-direction: column;
                justify-content:center ;
                align-items: center;
                width: 8vw;
                height: 8vw;
                background-color: #f2f2f2;
                &>.a1-z1{
                    font-size: 2.5vw;
                    color: #000000;
                }
                &>.a1-z2{
                    color: #666666;
                    font-size: 1.5vw;
                }
            }
            &>.item-a2{
                width: 30vw;
                height: 12vw;
                padding: 1.2vw 1vw 0 1.5vw;
                &>.a2-z1{
                    font-size: 1.3vw;
                    color: #000000;
                    margin-bottom: 1.5vw;
                }
                &>img{
                    float: right;
                    width: 1.3vw;
                    height: 1.3vw;
                    margin-top: -3vw;
                    margin-left: 2vw;
                }
                &>.a2-z2{
                    font-size: 1vw;
                    color: #666666;
                    padding-right: 2vw;
                }
            }
        }
    }
}